<template>
    <view>
        <cu-custom bgColor="bgmain" :isBack="true">
            <view slot="content">发布</view>
        </cu-custom>
        <view class="box margin padding">
            <view class="tit padding-bottom">
                <image class="icon margin-right-sm" src="/static/icon/fabu/content.png" mode="" />
                内容
            </view>

            <textarea maxlength="-1" v-model="content" class="margin-top" placeholder="请输入此刻的想法"></textarea>
             <!-- @input="getCon" -->
            <view class="flex" style="font-size:32rpx;" v-if="content.length>0">
                <view style="margin-left:auto;">
                     {{content.length}}个字
                     <!-- /不限制 -->
                </view>
            </view>
            <view>
                <view v-if="type == 'video'">
                    <image v-if="video == ''" @tap="choose" class="add" src="/static/images/article/add.png"></image>
                    <view class="preview" v-else>
                        <video class="add margin-right-sm" :src="video"></video>
                        <text @tap="delvideo" class="cuIcon-close close"></text>
                    </view>
                </view>
                <view class="flex" style="flex-flow: wrap;" v-else-if="type == 'image'">
                    <block key="index" v-for="(item, index) in picList" :key="index">
                        <view class="preview">
                            <image class="add margin-right-sm" :src="item"></image>
                            <text @tap="delimg" :data-index="index" class="cuIcon-close close"></text>
                        </view>
                    </block>
                    <image v-if="picList.length < 9" @tap="choose" class="add" src="/static/images/article/add.png"></image>
                </view>
                <image v-else @tap="choose" class="add" src="/static/images/article/add.png"></image>
            </view>
        </view>
        <view class="box margin padding" v-if="!classId">
            <view class="tit padding-bottom">
                <image class="icon margin-right-sm" src="/static/icon/fabu/quan.png" mode="" />
                圈子类型
            </view>
            <view class="types row">
                <block v-for="(item,i) in cateList" :key="i">
                    <view class="type margin-right margin-top" :class="index==i?'cur':''" @click="index=i">{{item.class_name}}</view>
                </block>
            </view>
        </view>
		<view class="box margin padding" v-if="!classId">
		    <view class="tit padding-bottom" @click="gettopic()">
		        <image class="icon margin-right-sm" src="/static/icon/fabu/huati.png" mode="" />
		        选择话题
				<image  class="icon margin-right-sm rights" src="/static/icon/fabu/hualiyou.png"></image>
		    </view>
		    <view class="types row ">
		        <block v-for="(item,i) in getlist" :key="i">
		            <view class="type margin-right margin-top paddings flex" >
					# {{item.title}}
					<view class="fork" @click="getfork(i)">
						<image src="/static/icon/fabu/cha.png" class="fork-image" ></image>
					</view>
					</view>
					
				</block>
		    </view>
		</view>
        <!-- <view class="box margin padding" v-if="sysparment.is_anonymous_switch">
            <view class="title">
                <view class="tit  row"  style="border-width:0px;">
                    是否匿名
                    <switch
                        class="is_agree"
                        :checked="is_agree"
                        color="#ff6344"
                        @change="checkagree"
                        :class="is_agree?'checked':''"
                    >
                    </switch>
                </view>
            </view>
        </view> -->
		<view class="box margin padding" v-if="school.is_invented == 1">
		    <view class="title">
		        <view class="tit  row"  style="border-width:0px;">
		         是否使用虚拟用户发布
		        <!-- <checkbox class="checkbox" @tap="checkagree" /> -->
		        <switch
		            class="is_agree"
		            :checked="is_invented"
		            color="#ff6344"
		            @change="invented"
		            :class="is_invented?'checked':''"
		        >
		        </switch>
		
				
		        
		    </view>
		    </view>
		</view>
		<!-- <view class="box margin padding" v-if="school.is_read == 1">
		    <view class="title">
		        <view class="tit  row"  style="border-width:0px;">
		         虚拟阅览量
		       <input type="number" class="is_agree" style="width: 50%;height: 100%;background-color: #f1f1f1;border-radius: 10rpx;" v-model="views_num">
		    </view>
		    </view>
		</view> -->
        <view class="box margin padding" v-if="payList.length>0">
             <view class="tit padding-bottom row">
               置顶圈子
                <!-- <view class="changes" @click="is_top=is_top==1?0:1" :class="is_top==1?'cur':''">
                    <image
                        class="dui"
                        src="/static/icon/fabu/dui.png"
                        mode="scaleToFill"
                   />
                 </view> -->
                  <switch
                    class="is_agree"
                    :checked="is_top"
                    color="#ff6344"
                    @change="is_top=is_top==1?0:1"
                    :class="is_top?'checked':''"
                >
                </switch>
             
            </view>
                <scroll-view scroll-x class="padding-top">
            <view class="pay_list flex" v-if="is_top==1">

                    <block v-for="(item,index) in payList" :key="index">
                        <view class="pay padding-top" :class="payIndex==index?'cur':''" @click="payIndex=index">
                            <view class="price flex">
                                <view class="num">{{item.price}}</view>
                                元
                            </view>
                            <view class="day">置顶{{item.day}}天</view>
                        </view>
                    </block>
            </view>

                </scroll-view>


        </view>

        <view class="padding" v-if="1==2">
            <view class="flex justify-between">
                <view>所属分类</view>
                <picker @change="bindPickerChange" :value="index" :range="cateList" range-key="class_name">
                    {{ cateList[index]['class_name'] }}
                    <text class="cuIcon-right"></text>
                </picker>
            </view>
            <view class="margin-top margin-bottom">上传图片/视频</view>
           
            <view class="margin-bottom-sm text-df margin-top flex align-center" v-if="sysparment.is_anonymous_switch">
                <checkbox class="checkbox" @tap="checkagree" />
                是否匿名
            </view>
            <view class="btn" @tap="submit">发布</view>
        </view>
        <view class="btn" @tap="submit">发布</view>
     </view>
</template>

<script>
// gc_school/pages/article/post.js
import siteInfo from '@/siteinfo.js';
var app = getApp();
export default {
    data() {
        return {
            ...this.configInfo,
            type: '',
            video: '',
            addedCount: 0,
            picList: [],
            images: [],
            content: '',
            cateList: [],
            index: 0,
            is_agree: 0,
            sysparment: {
                is_anonymous: 0
            },
            is_click: true,
            payList:[],
            payIndex:0,
            is_top:0,
            classId:0,
			student:0,
			getlist:[],
			is_invented:0,
			school:[],
			views_num:0
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    async onLoad(options) {
        this.classId=options.cid||0
		await this.login().then((res)=>{
		    console.log("您已登陆！");
		})
        this.getCate();
		this.top()
        this.getSysparment();
		// this.reward()
				var that = this
				uni.$on('getlist',function(data){
					that.getlist = data;
					// console.log('监听到事件来自 getlist ，携带参数为：', data);
				})
    },
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {
				this.getstudent();
				

	},
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {},
    /**
     * 页面上拉触底事件的处理函数
     */
    // onShareAppMessage: function () {
    // }
    onReachBottom: function () {},
    /**
     * 用户点击右上角分享
     */ methods: {
		 //选择话题
		 gettopic(){
			 //跳转话题页面
			 uni.navigateTo({
			 	url:'/gc_school/pages/article/topic'
				// url:'/gc_school/pages/article/topic?getlist=' + JSON.stringify(this.getlist)
			 })
		 },
		 getstudent(){
			 const self = this;
			 app.globalData.util.request({
			     url: 'Dmhstudent/view',
			 
			     success(res) {
			         self.setData({
			 			// sysparment: res.data.data.list[0].is_anonymous_switch
			             student: res.data.data.state
			         });
			     }
			 },true);
		 },
		 getfork(e){
			 this.getlist.splice(e, 1); // 删除二维数组中的下标里面的数据
		 },
        //获取列表
        getSysparment() {
            const self = this;
            app.globalData.util.request({
                url: 'Setting/view',
                success(res) {
                    self.setData({
						// sysparment: res.data.data.list[0].is_anonymous_switch
                        sysparment: res.data.data.sys
                    });
                }
            });
        },
		//获取学校信息
		getSysparment() {
		    var self = this;
		    app.globalData.util.request({
		        url: 'School/info',
				method: 'POST',
				data: {
				    s_id: uni.getStorageSync('schoolId')
				},
		        success(res) {
		           
						// sysparment: res.data.data.list[0].is_anonymous_switch
		                self.school =  res.data.data
		           
		        }
		    });
		},

        checkagree() {
			// if(this.student !=1){
			// 	uni.navigateTo({
			// 		url:'/gc_school/pages/user/student'
			// 	})
			// 	return false;
			// }else{
				// if(this.student ==1){
				this.is_agree = this.is_agree==1?0:1
			// 	}
			// }
			
            // this.setData({
            //     is_agree: !this.is_agree
            // });
            // console.log(this.is_agree);
        },

		invented() {
			// if(this.student !=1){
			// 	uni.navigateTo({
			// 		url:'/gc_school/pages/user/student'
			// 	})
			// 	return false;
			// }else{
				// if(this.is_invented ==1){
				//  this.is_invented = 0
				// }
				this.is_invented = this.is_invented==1?0:1
			// }
			
		    // this.setData({
		    //     is_agree: !this.is_agree
		    // });
		    // console.log(this.is_agree);
		},
        bindPickerChange(e) {
            this.setData({
                index: e.detail.value
            });
        },

		top()
		{
			var that = this;
			app.globalData.util.request({
			    url: 'TopSetting/index',
			    method: 'POST',
			    data: {
			        s_id: uni.getStorageSync('schoolId')
			    },
			
			    success(res) {
			        console.log(res.data.data);
			        that.setData({
			           payList: res.data.data.list
			        });
			    }
			});
		},
		
        //获取分类
        getCate() {
            var that = this;
            app.globalData.util.request({
                url: 'ZhForumClass/index',
                method: 'GET',
                data: {
                    s_id: uni.getStorageSync('schoolId'),
					type:1
                },

                success(res) {
                    console.log(res.data.data);
                    that.setData({
                        cateList: res.data.data.list
                    });
                }
            });
        },
        // getTopSetting(){
        //     api/TopSetting/index
        //     var that = this;
		// 	app.globalData.util.request({
		// 	    url: 'TopSetting/index',
		// 	    method: 'POST',
		// 	    data: {
		// 	        s_id: uni.getStorageSync('schoolId')
		// 	    },
			
		// 	    success(res) {
		// 	        console.log(res.data.data);
		// 	        that.setData({
		// 	            // cateList: res.data.data.list
		// 	        });
		// 	    }
		// 	});

        // },

        getCon(e) {
            if (e.detail.value) {
                this.setData({
                    content: e.detail.value.replace(/\s+/g, '')
                });
            }
        },

        choose() {
            var that = this;
            uni.chooseMedia({
                count: 9 - that.addedCount,

                success(res) {
                    // console.log(res)
                    // console.log(res.type)
                    that.setData({
                        type: res.type
                    });

                    if (res.type == 'image') {
                        that.uploadimg(res.tempFiles, 'ImgPost');
                    } else {
                        that.uploadvideo(res.tempFiles);
                    }
                }
            });
        },

       uploadvideo(data) {
           uni.showLoading({
               title: '上传中...',
               mask: true
           });
           var that = this;
           console.log(data[0]);
           uni.uploadFile({
               // url: app.globalData.util.url() + 'c=entry&a=wxapp&do=VideoPost&m=gc_school',
               // filePath: data[0]['tempFilePath'],
               // name: 'file',
               // formData: null,
       		
       		url: siteInfo.url+'Base/upload',
       		filePath: data[0]['tempFilePath'],
       		header:{
       			'Authorization':uni.getStorageSync('token')
       		},
       		name: 'file',
       		formData: {
       			'wxapp_id':siteInfo.uniacid
       		},
               success: (resp) => {
                   console.log(JSON.parse(resp.data));
                   that.setData({
                       video: JSON.parse(resp.data).data
                   });
                   uni.hideLoading({});
               }
           });
       },
       
       uploadimg: function (data, method, type) {
           uni.showLoading({
               title: '上传中...',
               mask: true
           });
           var that = this; // var count = that.data.addedCount + data.length;
       
           var count = that.addedCount;
       
           for (var i = 0; i < data.length; i++) {
               uni.uploadFile({
                   url: siteInfo.url+'Base/upload',
                   filePath: data[i]['tempFilePath'],
                   header:{
                   	'Authorization':uni.getStorageSync('token')
                   },
                   name: 'file',
                   formData: {
                   	'wxapp_id':siteInfo.uniacid
                   },
                   success: (resp) => {
       				// console.log("上传返回",resp.data)
                       var pic = JSON.parse(resp.data);
       				console.log("打印",pic)
                       if (pic.status == 200) {
                           count++;
                           var picList = that.picList;
                           picList.push(pic.data);
                           var images = that.images.concat(pic.data);
                           that.setData({
                               images: images,
                               addedCount: count,
                               picList: picList
                           });
                           console.log(count);
                           console.log('值', that.picList.length);
       
                           if (count == that.picList.length) {
                               uni.hideLoading({});
                           }
                       } else {
                            uni.hideLoading();
                           uni.showToast({
                               title: pic.msg,
                               icon: 'none'
                           });
                       }
                   }
               });
           }
       },
       
       //删除视频
       delvideo() {
           this.setData({
               video: ''
           });
           console.log(this.video);
       },
       
       //删除图片
       delimg(e) {
           var index = e.currentTarget.dataset.index;
           var addcount = this.addedCount - 1;
           this.picList.splice(index, 1);
           this.setData({
               picList: this.picList,
               addedCount: addcount
           });
       },


		reward()
		{
			app.globalData.util.request({
			    url: 'ZhArticles/reward',
			    method: 'POST',
			    data: {
					price:0.02,
					a_id:48,
			        s_id: uni.getStorageSync('schoolId'),
			    },
				success(res)
				{
					uni.requestPayment({
						timeStamp: res.data.data.paydata.timestamp.toString(),
						nonceStr: res.data.data.paydata.nonceStr,
						package: res.data.data.paydata.package,
						signType: 'MD5',
						paySign: res.data.data.paydata.paySign,
						success: function (resu) {
							console.log('success');
							console.log(res.data.data);
						},
						fail: function (res) {
							console.log('fail');
						}
					});
				}
			},true)
				
				
		},

        //发布
        submit() {
			var content = this.is_agree==1?'圈子发布匿名功能需要您进行实名认证':'圈子发布需要您进行实名认证'
			if((this.student !=1 && this.is_agree == 1)  || (this.student !=1 && uni.getStorageSync('sys').is_article_auth==1)){
				if(this.student == 0 ){
					 app.globalData.util.message('请等待审核结果', '', 'error');
					return false;
				}
				uni.showModal({
					title:'温馨提示',
					content: content,
					
					success(res) {
						if (res.confirm) {
							uni.navigateTo({
								url:'/gc_school/pages/user/student'
							})
						} else {
							console.log('取消删除');
						}
					}
				});
				// app.globalData.util.message('发布匿名需要进行实名认证' ,'', 'error');
				// uni.showToast({
				// 	title: '发布匿名需要进行实名认证',
				// 	icon: 'success'
				// });
				// setTimeout(function () {
				// uni.navigateTo({
				// 	url:'/gc_school/pages/user/student'
				// })
				// },2000)
				return false;
			}
            var self = this;

            if (self.content == '') {
                app.globalData.util.message('请输入内容', '', 'error');
                return false;
            }

            if (self.is_click) {
                self.setData({
                    is_click: false
                });
				if(self.picList.length>0)
				{
					var image = self.picList.join(',')
				}
				else{
					var image = self.picList
				}
                app.globalData.util.request({
                    url: 'ZhArticles/add',
                    method: 'POST',
                    data: {
                        class_id:this.classId||self.cateList[self.index].class_id,
                        content: self.content,
						type:1,
						price:this.payList.length>0?this.payList[this.payIndex].price:0,
						is_top:this.is_top,
						day:this.payList.length>0?this.payList[this.payIndex].day:0,
                        // type: self.type,
                        video: self.video,
                        image: image,
                        s_id: uni.getStorageSync('schoolId'),
                        is_anonymous: self.is_agree,
						topic:this.getlist.map(item=>item.id).join(','),
						is_invented:this.is_invented,
						views_num:this.views_num
                    },

                    success(res) {
                        console.log(res.data.data);
                        self.setData({
                            content: ''
                        });
						
						if(res.data.status==200)
						{
							if(res.data.msg=='操作成功')
							{
								uni.showToast({
									title: '提交成功',
									icon: 'success'
								});
								setTimeout(function () {
									uni.redirectTo({
										url: '/gc_school/pages/article/my'
									});
								}, 1000);
							}
							else{
								uni.requestPayment({
								    timeStamp: res.data.data.paydata.timestamp.toString(),
								    nonceStr: res.data.data.paydata.nonceStr,
								    package: res.data.data.paydata.package,
								    signType: 'MD5',
								    paySign: res.data.data.paydata.paySign,
								    success: function (resu) {
								        console.log('success');
								        console.log(res.data.data);
								        
								        setTimeout(function () {
								        	uni.redirectTo({
								        		url: '/gc_school/pages/article/my'
								        	});
								        }, 1000);
								    },
								    fail: function (res) {
								        console.log('fail');
								    }
								});
							}
						}
						else{
							uni.showToast({
								title: res.data.msg,
								icon: 'none'
							});
						}
                    },

                    complete() {
                        self.setData({
                            is_click: true
                        });
                    }
                },true);
            } else {
                uni.showToast({
                    title: '请勿重复点击',
                    icon: 'none'
                });
            }
        }
    }
};
</script>
<style>
page {
    background: white;
}
.bgmain {
    background-color: #ff6444;
    background: #f7f6f5;
    color: white;
    color: #000;
}
textarea {
    background: #f9f9f9;
    width: 100%;
    padding: 20rpx 0;
    font-size: 28rpx;
}
.add {
    width: 180rpx;
    height: 180rpx;
	border-radius: 10rpx;
	margin-top: 10rpx;
}
.btn {
    display: block;
    background: #ff6344;
    color: white;
    width: 90%;
    margin: 100rpx auto;
    border-radius: 50rpx;
    padding: 25rpx 0;
    font-size: 28rpx;
}
.preview {
    position: relative;
    width: 210rpx;
}
.close {
    position: absolute;
    right: 30rpx;
    font-size: 40rpx;
}
.checkbox {
    transform: scale(0.8, 0.8);
}
.checkbox .wx-checkbox-input {
    /* border-radius: 50%; */
    width: 40rpx; /* 选中后对勾大小，不要超过背景的尺寸 */
    height: 40rpx;
}
.rights{
	margin-top: 10rpx;
	float: right;
	width: 14rpx !important;
	height: 24rpx !important;
}
.paddings{
	padding: 10rpx 15rpx !important;
	font-size: 24rpx !important;
}
.fork{
	width: 60rpx;
	height: 24rpx;
	display: flex;
	justify-content: center;
	align-items: center;
}
.fork-image{
	width: 16rpx;
	height: 16rpx;
}
	/* 留言框 */
	.comment_input {
		height: 120rpx;
		position: fixed;
		left: 0rpx;
		bottom: 0rpx;
		background-color: white;
		z-index: 99;
		width: 100%;
		padding: 20rpx;
		border-top: 1rpx solid #eee;
		display: flex;
	}

	.comment_input input {
		background-color: #f2f2f2;
		width: 85%;
		height: 80rpx;
		border-radius: 10rpx;
		padding-left: 10rpx;
		font-size: 30rpx;
	}

	.comment_input .submit {
		padding: 20rpx 20rpx;
		background-color: #ff6666;
		color: white;
		margin-left: 20rpx;
		flex-shrink: 0;
		border-radius: 10rpx;
		/* #FED948 */
	}
</style>

<style lang="scss">
    @import "./main.scss";
</style>